<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>用户注册</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    <!-- Bootstrap 3.3.6 -->
    <link rel="stylesheet" href="__ADMIN__/css/bootstrap.min.css">
    <!-- Font Awesome -->
    <link rel="stylesheet" href="__ADMIN__/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="__ADMIN__/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="__ADMIN__/css/AdminLTE.min.css">
    <!-- iCheck -->
    <link rel="stylesheet" href="__PLUGIN__/iCheck/all.css">
    <!-- bootstrapValidator -->
    <link rel="stylesheet" href="__PLUGIN__/bootstrapvalidator/css/bootstrapValidator.min.css">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
</head>
<body class="hold-transition register-page">
<div class="register-box">
    <div class="pull-left image" style="padding-left:30px;">
        <img src="__ADMIN__/img/user2-160x160.jpg" class="img-circle" style="width:100%;max-width:68px;height:auto;" />
    </div>
    <div class="register-logo">
        <a href="#"><b>食安</b>广陈</a>
    </div>

    <div class="register-box-body">

        <form  action="" method="post">
            <div class="form-group has-feedback row" style="padding-left: 100px;">
                {volist name='roles' id='role'}
                <div class="radio">
                    <label>
                        <input type="radio" class="minimal" name="admin_role" value="{$key}">
                        {$role}
                    </label>
                </div>
                {/volist}
            </div>
            <div class="form-group has-feedback">
                <input type="text" class="form-control" id="tel" name="tel" placeholder="电话号码">
                <span class="glyphicon glyphicon-user form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" class="form-control" id="admin_password" name="admin_password" placeholder="密码">
                <span class="glyphicon glyphicon-lock form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="password" class="form-control" id="repassword" name="repassword" placeholder="确认密码">
                <span class="glyphicon glyphicon-log-in form-control-feedback"></span>
            </div>
            <div class="form-group has-feedback">
                <input type="text" class="form-control" placeholder="验证码" id="yzm" name="yzm">
                <span class="glyphicon glyphicon-share form-control-feedback"></span>
            </div>
            <div class="row">
                <div class="col-xs-8">
                    <img style="margin-left: 3px;" src='/captcha.html' onclick="this.src='/captcha.html?t='+Math.random()" title="如错误请点击刷新验证码！"/><br/>如错误请点击刷新验证码！
                </div>
                <!-- /.col -->
                <div class="col-xs-4">
                    <button type="submit" class="btn btn-primary btn-block btn-flat">注册</button>
                </div>
                <!-- /.col -->
            </div>

        </form>

        <a href="login.html" class="text-center">我已经有帐户请点击登录!</a>
    </div>
    <!-- /.form-box -->
</div>
<!-- /.register-box -->

<!-- jQuery 2.2.3 -->
<script src="__ADMIN__/js/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="__ADMIN__/js/bootstrap.min.js"></script>
<!-- iCheck -->
<script src="__PLUGIN__/iCheck/icheck.min.js"></script>
<!-- bootstrapValidator -->
<script src="__PLUGIN__/bootstrapvalidator/js/bootstrapValidator.min.js"></script>
<script>
    $(function () {
        //iCheck for checkbox and radio inputs
        $('input[type="checkbox"].minimal, input[type="radio"].minimal').iCheck({
            checkboxClass: 'icheckbox_minimal-blue',
            radioClass: 'iradio_minimal-blue'
        });
        $('input[type="checkbox"].minimal, input[type="radio"].minimal').on('ifChecked', function (event) {
            //alert(event.type + 'callback');
            //$("form").bootstrapValidator();
            //$('form').data('bootstrapValidator').validate();
            //重置表单所有验证规则
            $('form').data("bootstrapValidator").resetForm();
        });
        //bootstrapValidator
        $('form').bootstrapValidator({
            message: 'This value is not valid',
            feedbackIcons: {
                valid: 'glyphicon glyphicon-ok',
                invalid: 'glyphicon glyphicon-remove',
                validating: 'glyphicon glyphicon-refresh'
            },
            fields: {
                admin_role: {
                    validators: {
                        notEmpty: {
                            message: '部门角色不能为空'
                        },
                        digits:{
                            message: '部门角色必须填数字'
                        }
                    }
                },
                tel: {
                    message: '电话号码验证失败',
                    validators: {
                        notEmpty: {
                            message: '电话号码不能为空'
                        }
                    }
                },
                admin_password: {
                    validators: {
                        notEmpty: {
                            message: '密码不能为空'
                        }
                    }
                },
                repassword: {
                    validators: {
                        notEmpty: {
                            message: '用户确认密码不能为空'
                        },
                        identical: {
                            field: 'admin_password',
                            message: '*两次输入密码不一致'
                        }
                    }
                },
                yzm: {
                    validators: {
                        notEmpty: {
                            message: '验证码不能为空'
                        }
                    }
                }
            }
        });
    });
</script>
</body>
</html>
